<template>
  <div class="search_container searchArea">
        <el-form 
            :inline="true" 
            :model='search_data' 
            :rules="rules"
            ref="search_data" 
			label-width="120px"
			label-position="left"
            class="demo-form-inline search-form">
			<el-row>
				<el-form-item label="中奖状态:">
					<el-radio v-model="search_data.prizeStatus" label="" border>全部</el-radio>
					<el-radio v-model="search_data.prizeStatus" label="1" border>已中奖</el-radio>
					<el-radio v-model="search_data.prizeStatus" label="2" border>未中奖</el-radio>
                    <el-radio v-model="search_data.prizeStatus" label="0" border>未开奖</el-radio>
				</el-form-item>
			</el-row>
			<el-row>
				<el-form-item label="中奖处理:">
					<el-radio v-model="search_data.prizeType" label="" border>全部</el-radio>
					<el-radio v-model="search_data.prizeType" label="1" border>平台寄货</el-radio>
					<el-radio v-model="search_data.prizeType" label="2" border>平台寄售</el-radio>
				</el-form-item>
			</el-row>
			<el-row>
				<el-form-item label="创建时间:">
                    <el-date-picker
                        v-model="search_data.beginTime"
                        type="datetime"
                        placeholder="选择日期时间">
                    </el-date-picker>
                    <el-date-picker
                        class="endTime"
                        v-model="search_data.endTime"
                        type="datetime"
                        placeholder="选择日期时间">
                    </el-date-picker>
					<!-- <el-radio v-model="radio1" label="1" border>全部</el-radio>
					<el-radio v-model="radio1" label="2" border>今天</el-radio>
					<el-radio v-model="radio1" label="3" border>昨天</el-radio>
					<el-radio v-model="radio1" label="4" border>最近7天</el-radio>
					<el-radio v-model="radio1" label="5" border>最近30天</el-radio>
					<el-radio v-model="radio1" label="6" border>本月</el-radio>
					<el-radio v-model="radio1" label="7" border>自定义</el-radio> -->
				</el-form-item>
			</el-row>
			<el-row>
				<el-form-item label="订单号:">
					<el-input 
						v-model="search_data.orderSn" 
						placeholder="订单号"  
						@keyup.enter.native='onScreeoutMoney("search_data")'>
					</el-input>
				</el-form-item>
				<el-form-item>
				    <el-button type="primary" size ="mini" icon="search" @click='onScreeoutMoney("search_data")'>筛选</el-button>
				</el-form-item>
				<el-form-item >
				    <el-button type="primary" size ="mini" icon="view" @click='checkout()'>导出</el-button>
				</el-form-item>
			</el-row>
           
        </el-form>
    </div>
</template>

<script>
   import { mapGetters } from 'vuex'

  export default {
      name:'searchItem',
      data(){
          return {
			radio1: '',
			options: [{
			  value: '选项1',
			  label: '正常'
			}, {
			  value: '选项2',
			  label: '失效'
			}],
            search_data:{
                orderSn:'',
                prizeStatus:'',
                prizeType:'',
                beginTime:'',
                endTime: ''
            },
            rules: {
                name: [
                    { required: true, message: '请输入用户名', trigger: 'blur' },
                ]
            }
          }
      },
       computed:{
        ...mapGetters(['searchBtnDisabled']),
      },
      created(){
      },
      methods:{
          checkout() {
              this.$emit('checkout');
          },
          onScreeoutMoney(searchForm){
              this.$refs[searchForm].validate((valid) => {
					if (valid) {
                        this.$store.commit('SET_SEARCH',this.search_data);
                        this.$emit("searchList");
                    }
              })
          },
          onAddMoney(){
              this.$emit("showDialog",'add');
          },
          onBatchDelMoney(){
              this.$emit("onBatchDelMoney");
          }
      }
  }
</script>

<style lang="less" scoped>
	.el-radio{
		margin-right: 0;
	}
    .search_container{
        margin-bottom: 20px;
    }
    .btnRight{
        float: right;
        margin-right: 0px !important;
    }
    .searchArea{
        background:rgba(255,255,255,1);
        border-radius:2px;
        padding: 18px 18px 0;
    }
    .search-form .el-form-item .el-date-editor{
		&.endTime{
            margin-left: 10px;
        }
    }
</style>
